JavaScript ポップアップメニューその2

このページにはポップアップメニューがあり、ページやURLを選択できます。

JavaScript は Netscape Navigator 2.0 以降と、Internet Explorer for MacOS 3.0.1 以降でのみ使用可能なことに注意してください。
あなたの観客の全てが JavaScript 対応のブラウザを使用しているわけではありません。.

これは、他のページにリンクするポップアップメニューを作るのに JavaScript を使用するもうひとつの例です。この例では特に "Go"ボタンが必要ありません。ポップアップメニューを選択すると即座にアクションが起こります。

ノート：このページは、あなたのローカルディスクに保存されたものを Internet Explorer を使ってロードしてもうまく表示されません。ウェブサーバーに保存されたものはうまく表示されます。

>使い方

ポップアップメニューその２のソースは以下のようなものです：
<FORM>
<SELECT NAME="menu" onChange="top.location.href =
 this.form.menu.options[this.form.menu.selectedIndex].value">
<OPTION SELECTED VALUE="index.html">目次 
<OPTION VALUE="groucho.html">Groucho 
<OPTION VALUE="harpo.html">Harpo 
<OPTION VALUE="chico.html">Chico 
<OPTION VALUE="zeppo.html">Zeppo 
</SELECT>
</FORM>
OPTION タグに含まれている行を編集して、リンクと表示されるテキスト変更してください。VALUE アトリビュートの中には、フルパスの URL を入れる事もできます。

プログラム上の注意

実際の JavaScript は選択リストの onChange ハンドラーの中にあります。JavaScript 配列 this.form.menu.options は、"menu"と名付けられたフォームにある、オプションタグ(とその内容)の配列です。どのメニュー項目が選択されているかを見つけるには、プロパティthis.form.menu.selectedIndexを使います。ここに、選択された項目のインデックスが保持されています。
それから、this.form.menu.options[this.form.menu.selectedIndex].valueの式で配列の中から選択されている項目の属性値にアクセスしてページの名前を入手します。
top.location.href は、ウィンドウに表示される URL のアドレスです。我々は、top.locationに新しいページの URLを含むようセットしているので、我々のページがフレームの中にあっても新しいページがウィンドウ全体に表示されます。
特定のフレーム内に表示される内容を変更したい場合は、 top と共に top.frames.name_of_the_frameを変更するとできます。例えば、フレーム定義ページにある "contact"という名前のフレームでは、フレームのソースを top.frames.contact.location.hrefのようにしてアクセスできます。